<!--
  * 捐赠清单
-->
<template>
    <div class="height100">
        <a-row :gutter="16" class="height100">
            <a-col :span="3">
                <YearTree @getItemId="getId" />
            </a-col>
            <a-col :span="21" class="height100">
                <div class="employee-box height100">
                    <YearList style="flex-grow: 2.5" class="employee" :year="passId" />
                </div>
            </a-col>
        </a-row>
    </div>
</template>
<script setup>
    import _ from 'lodash';
    import { computed, provide, ref, watch, watchEffect } from 'vue';
    import YearTree from './modules/year-tree/index.vue';
    import YearList from './modules/year-list/index.vue';
    defineProps({
        value: Object,
    });
    const passId = ref('');
    // 逆向传值
    let getId = (value) => {
        passId.value = value;
    }
    // 监听值的变化
    watch(passId, (newValue, oldValue) => {
        passId.value = newValue;
    });
</script>
<style scoped lang="less">
    .height100 {
        height: 100%;
    }

    .employee-box {
        display: flex;
        flex-direction: column;

        .employee {
            flex-grow: 2;
        }
    }
</style>